/*
 * Dandelion Admin v1.0 - Pick List Stylesheet
 *
 * This file is part of Dandelion Admin, an Admin template build for sale at ThemeForest.
 * For questions, suggestions or support request, please mail me at maimairel@yahoo.com
 *
 * Development Started:
 * March 25, 2012
 *
 * ===============================================
 * Table of Contents
 * ===============================================
 *
 * 1. Picklist Clearfix
 * 2. Picklist Container
 * 3. Picklist Buttons
 * 4. Picklist Items
 *
 */

/* (1) Picklist Clearfix
================================================== */

.pickList:after {
	clear: both;
	content: ' ';
	display: block;
	font-size: 0;
	line-height: 0;
	visibility: hidden;
	width: 0;
	height: 0;
}

* html .pickList  {
	height: 1%;
}

/* (2) Picklist Container
================================================== */

.pickList
{
	position:relative;
}

.pickList .pickList_listContainer
{
	float:left;
	width:40%;
}

.pickList .pickList_controlsContainer
{
	float:left;
	width:20%;
	padding:0 16px;
	position:relative;
	margin-top:18px;
	
	-webkit-box-sizing: border-box;
	-o-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;	
}

/* (3) Picklist Buttons
================================================== */

.pickList .pickList_controlsContainer button
{
	margin:auto;
	width:32px;
	display:block;
	
	border:none; outline:none;
	font:12px/17px 'Helvetica Neue', Arial, Helvetica, sans-serif;
	margin:3px auto;
	text-decoration:none !important;
	overflow:visible;
	color:#666666;
	cursor:pointer;
	zoom:1;
	overflow:hidden;
	*overflow:visible;
	outline:none;
	text-align:center;
	
	border:1px solid #9e9e9e;
	border-style:solid;
	
	-webkit-border-radius:2px;
	-o-border-radius:2px;
	-moz-border-radius:2px;
	border-radius:2px;
	
	-webkit-appearance:none;
	-webkit-box-shadow:0 1px 1px rgba(0, 0, 0, 0.15), inset 0 1px 1px rgba(255, 255, 255, 0.35);
	-o-box-shadow:0 1px 1px rgba(0, 0, 0, 0.15), inset 0 1px 1px rgba(255, 255, 255, 0.35);
	-moz-box-shadow:0 1px 1px rgba(0, 0, 0, 0.15), inset 0 1px 1px rgba(255, 255, 255, 0.35);
	box-shadow:0 1px 1px rgba(0, 0, 0, 0.15), inset 0 1px 1px rgba(255, 255, 255, 0.35);
	
	-webkit-tap-highlight-color:rgba(0, 0, 0, 0);
	
	background-color:rgb(227,227,227);
	background-image: linear-gradient(bottom, rgb(227,227,227) 0%, rgb(249,249,249) 100%);
	background-image: -o-linear-gradient(bottom, rgb(227,227,227) 0%, rgb(249,249,249) 100%);
	background-image: -moz-linear-gradient(bottom, rgb(227,227,227) 0%, rgb(249,249,249) 100%);
	background-image: -webkit-linear-gradient(bottom, rgb(227,227,227) 0%, rgb(249,249,249) 100%);
	background-image: -ms-linear-gradient(bottom, rgb(227,227,227) 0%, rgb(249,249,249) 100%);
	
	background-image: -webkit-gradient(
		linear,
		left bottom,
		left top,
		color-stop(0, rgb(227,227,227)),
		color-stop(1, rgb(249,249,249))
	);
}

.pickList .pickList_controlsContainer button:active
{
	background-image:none !important;

	-webkit-box-shadow:inset 0 1px 2px rgba(0, 0, 0, 0.1);
	-o-box-shadow:inset 0 1px 2px rgba(0, 0, 0, 0.1);
	-moz-box-shadow:inset 0 1px 2px rgba(0, 0, 0, 0.1);
	box-shadow:inset 0 1px 2px rgba(0, 0, 0, 0.1);
}

.pickList .pickList_controlsContainer button:disabled
{
	background-image:none;
	
	-webkit-box-shadow:none;
	-o-box-shadow:none;
	-moz-box-shadow:none;
	box-shadow:none;
	
	color:#dadada;
	background-color:#f8f8f8;
	border-color:#dddddd;
	cursor:default;
}

.pickList .pickList_controlsContainer button.pickList_remove
{
	display:block;
	clear:left;
}

/* (4) Picklist Items
================================================== */

.pickList .pickList_listContainer ul, 
.pickList .pickList_listContainer ul li
{
	margin:0;
	list-style:none;
}

.pickList .pickList_listLabel
{
	font-style:italic;
	display:block;
	margin-bottom:3px;
}

.pickList .pickList_list
{
	border:1px solid #d1d1d1;
	height:200px;
	overflow-y:auto;
	
	-webkit-border-radius:2px;
	-o-border-radius:2px;
	-moz-border-radius:2px;
	border-radius:2px;
	
	-webkit-box-shadow:0 1px 0 rgba(255, 255, 255, 1), inset 0 1px 1px rgba(0, 0, 0, 0.04);
	-moz-box-shadow:0 1px 0 rgba(255, 255, 255, 1), inset 0 1px 1px rgba(0, 0, 0, 0.04);
	-o-box-shadow:0 1px 0 rgba(255, 255, 255, 1), inset 0 1px 1px rgba(0, 0, 0, 0.04);
	box-shadow:0 1px 0 rgba(255, 255, 255, 1), inset 0 1px 1px rgba(0, 0, 0, 0.04);
}

.pickList .pickList_list .pickList_listItem
{
	cursor:default;
	padding:3px 6px;
}

.pickList .pickList_list .pickList_listItem:hover, 
.pickList .pickList_list .pickList_listItem.pickList_selected
{
	background-color:#A9CA60;
	color:#ffffff;
}

.pickList .pickList_list .pickList_listItem:hover
{
	cursor:pointer;
}
